<!--
 * @Author: your name
 * @Date: 2019-06-08 07:51:53
 * @LastEditTime: 2019-10-30 18:03:02
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: /-/src/components/bottomButton/bottomButton.vue
 -->
<template>
	<view class="details-footer">
		<view class="telephone" v-if="mobile" :data-number="mobile" :data-id="cid" @click="callPhone">电话咨询</view>
		<view class="telephone" v-else :data-number="'010-86390610'" @click="callPhone">
			<view class="icon">
				<image src="../../static/images/icon-phone.png" mode="scaleToFill" lazy-load="false">
				</image>
			</view>
			电话咨询
		</view>
		<view class="on-line" :data-url="'applyNow'" :data-id="loanId" :data-link='link' :data-uid="uid" v-if="isTag" @click="isTag ?onLine($event):''">
			<view class="icon">
				<image src="../../static/images/icon-apply.png" mode="scaleToFill" lazy-load="false">
				</image>
			</view>
			立即申请
		</view>
		<view class="on-line" :data-url="'chat'" :data-id="cid" :data-link="link" :data-image="image" :data-uid="uid" v-else
		 @click="!isTag ?onLine($event):''">
			<view class="icon">
				<image src="../../static/images/icon-apply.png" mode="scaleToFill" lazy-load="false">
				</image>
			</view>在线咨询
		</view>
	</view>
</template>
<script>
	import Vue from "vue";
	import InterServer from "@/common/config/server";
	import {
		isLogin
	} from "@/common/utils/util";
	import {
		localStorageSyncServer
	} from "@/common/js/common"
	export default {
		props: ["isTag", "loanId", "mobile", "cid", "type", "attention", "uid", "image", "link"],
		data() {
			return {
				isFollow: false //0未关注 1关注
			};
		},
		activated() {
			this.isFollow = this.attention
		},
		onLoad() {
			console.log(this.isTag)
		},
		methods: {
			//点击关注或点击取消关注
			isFollowFn() {
				let _that = this;
				isLogin().then(res => {
					if (res) {
						InterServer.mark({
							id: _that.cid,
						}).then(res => {
							if (res.code == 200) {
								_that.isFollow = !_that.isFollow;
								Vue.showCustomToast("关注成功")
							}
						})
					}
				});
			},
			//页面跳转
			onLine(e) {
				isLogin().then(res => {
					if (res) {
						const dataset = e.currentTarget.dataset;
						let [url, image, id, link, uid] = [dataset.url, dataset.image, dataset.id, dataset.link, dataset.uid];
						localStorageSyncServer.set("herderRobotImg", this.image)
						//return console.log(url)
						if (url == "applyNow") {
							if (link) {
								let url = `./productLink?link=${link}`;
								InterServer.loanApply({
									loanId: Number(id),
								}).then(res => {
									if (res.code == 200) {
										Vue.customNavigateTo(url);
										// #ifdef H5
										window.location.href = link;
										// #endif
										//#ifdef APP-PLUS || MP-WEIXIN
										Vue.customNavigateTo(url);
										// #endif
									}
								})
							} else {
								Vue.customNavigateTo(`${url}?id=${id}`);
							}
						} else {
							InterServer.advisoryRecord({
								cid: id,
								type: 1 //0快捷电话 1图文咨询
							}).then(res => {
								Vue.customNavigateTo(`${url}?id=${uid}`);
							});
						}
					}
				});
			},
			//电话咨询
			callPhone(e) {
				isLogin().then(res => {
					if (res) {
						const dataset = e.currentTarget.dataset;
						let [phoneNumber, id] = [dataset.number, dataset.id];
						uni.makePhoneCall({
							phoneNumber: phoneNumber
						});
						this.advisoryRecord(id);
					}
				});
			},
			//快捷电话和图文咨询记录
			advisoryRecord(id) {
				if (id) {
					InterServer.advisoryRecord({
						cid: id,
						type: 0 //0快捷电话 1图文咨询
					}).then(res => {
						console.log(res);
					});
				}

			}
		}
	};
</script>
<style lang="less" scoped>
	.details-footer {
		position: fixed;
		bottom: 0;
		left: 0;
		display: flex;
		text-align: center;
		color: #ffffff;
		background: #ffffff;
		font-size: 32upx;
		height: 98upx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		width: 100%;

		.telephone {
			width: 360upx;
			height: 70upx;
			line-height: 58upx;
			background: linear-gradient(180deg, rgba(245, 195, 95, 1) 0%, rgba(255, 153, 0, 1) 100%);
			border-radius: 35upx;
			font-size: 32upx;
			font-family: PingFang-Semibold;
			font-weight: bold;
			color: rgba(255, 255, 255, 1);
			display: flex;
			justify-content: center;
			align-items: center;

		}

		.consultation {
			width: 360upx;
			height: 70upx;
			line-height: 58upx;
			background: linear-gradient(180deg, rgba(245, 195, 95, 1) 0%, rgba(255, 153, 0, 1) 100%);
			border-radius: 35upx;
			display: flex;
			justify-content: center;
			align-items: center;
		}

		.on-line {
			width: 360upx;
			height: 70upx;
			line-height: 58upx;
			background: linear-gradient(180deg, rgba(245, 195, 95, 1) 0%, rgba(255, 153, 0, 1) 100%);
			border-radius: 35upx;
			display: flex;
			justify-content: center;
			align-items: center;
		}

		.icon {
			width: 24uxp;
			margin-right: 10upx;

			image {
				width: 24upx;
				height: 25upx;
			}
		}
	}
</style>
